Detector Docs

English

Español

English

Español

Appearance

Detector Limitations with Gradients and Complex Backgrounds ​

Image-based contrast analysis has limitations when the final perceived color is the result of multiple layers, transformations, or dynamic positions. The following describes known cases where the detector cannot guarantee full accuracy.

1. Backgrounds with absolute images or fixed behavior ​

Description ​

When an element uses a background image positioned absolutely (background-position) or with fixed behavior (background-attachment: fixed), the specific portion of the image behind the text cannot be determined in a stable way. This causes the detector to be unable to correctly associate the text area with the exact fragment of the background, resulting in approximate or inconsistent colors.

Examples ​

Technical References ​

2. Use of color combined with background-image (gradient or image) ​

Description ​

When the background of an element is a gradient or an image that varies significantly in color, the text may sit on top of multiple tones within the same area. This means there is no single representative background value for calculating contrast, causing false positives or measurement variation.

Example ​

Technical Reference ​

3. Images used as "background to add color" (overlays, blends, and filters) ​

Description ​

Many sites apply images combined with semi-transparent layers, overlays, background-blend-mode, filters, or similar structures to "tint" the background. In these cases, the final color is the product of several overlapping layers. The detector, lacking direct access to the browser's final graphics pipeline, cannot faithfully reconstruct the resulting color.

Examples ​

Technical References ​

4. Gradient used as foreground (text with gradient) ​

Description ​

Some sites apply gradients as the text color (foreground), for example using:

  • background-clip: text
  • -webkit-text-fill-color: transparent

In these cases, the text color is not a single value, but a combination of multiple tones across a gradient. This prevents a consistent single foreground color from being determined for contrast purposes.

Example ​

Technical Reference ​

Conclusion ​

These limitations are inherent to the dynamic and visually complex nature of modern gradients and graphic compositions. In these cases:

  • The detector may deliver approximate values, not definitive ones.
  • Results should be considered indicative, requiring manual validation.
  • It is recommended to document expected behavior to avoid false positives and improve the QA experience.